import React from 'react'


import {
    DeviceEventEmitter,
    Dimensions,
    Image,
    NativeModules,
    Platform,
    StyleSheet,
    Text,
    TouchableOpacity,
    View
} from 'react-native';
import BasePage from './Component/Common/BasePage';

import PageView from './Component/Common/PageView'
import {NavigationBar} from 'teaset';
import CommonStyle from "./Component/CommonStyle";

import SQLite from './SQLite';

var sqLite = new SQLite();
var db;

const defaultOptions = {
    imageCount: 1,             // 最大选择图片数目，默认6
    isRecordSelected: false,   // 是否已选图片
    isCamera: true,            // 是否允许用户在内部拍照，默认true
    isCrop: true,             // 是否允许裁剪，默认false, imageCount 为1才生效
    CropW: ~~(width * 0.6),    // 裁剪宽度，默认屏幕宽度60%
    CropH: ~~(width * 0.6),    // 裁剪高度，默认屏幕宽度60%
    isGif: false,              // 是否允许选择GIF，默认false，暂无回调GIF数据
    showCropCircle: true,     // 是否显示圆形裁剪区域，默认false
    circleCropRadius: width / 2, // 圆形裁剪半径，默认屏幕宽度一半
    showCropFrame: true,       // 是否显示裁剪区域，默认true
    showCropGrid: false,       // 是否隐藏裁剪区域网格，默认false
    quality: 90,               // 压缩质量
    enableBase64: false,       // 是否返回base64编码，默认不返回
};
const {RNSyanImagePicker} = NativeModules;

const {width} = Dimensions.get('window');

//todo 场景选择
export default class Kuaiopage extends BasePage {


    constructor(props) {
        super(props);
        this.state = {
            ...this.state,
            head: require('./images/head.png'),

            name: '',
            isshow: false

        };

    }


    componentWillMount() {


        this.showLoad(true)
        setTimeout(this.openApp.bind(this), 2000);
    }

    openApp() {
        this.showLoad(false)

        this.setState({
            isshow: true
        })
    }

    renderNavigationBar() {
        return (
            <NavigationBar
                style={{backgroundColor: 'white',}}

                title={
                    <View style={{
                        flexDirection: 'row',
                        justifyContent: 'center',
                        alignSelf: 'center',

                    }}>
                        <Text style={{
                            fontSize: 20,
                            color: '#333333'
                        }}>开关某条自动化</Text>
                    </View>}

                leftView={<TouchableOpacity
                    onPress={() => {


                        this.navigator.pop();


                        // DeviceEventEmitter.emit('my', {text: '刷新'})

                    }}
                >
                    <Image style={{width: 15, height: 15, marginLeft: 20}} source={require('./images/btn_back.png')}/>

                </TouchableOpacity>}

            />

        );
    }


    _onChangeText(inputData) {
        console.log("输入的内容", inputData);
        //把获取到的内容，设置给showValue
        // this.setState({showValue: inputData});
    }

    _fanhui(index) {
        DeviceEventEmitter.emit("allfanhui", index);
        this.navigator.pop();
    }

    renderPage() {


        return (

            <PageView style={{
                flex: 1
            }} hiddenNav={true} fromPage={this} {...this.state}>
                <View style={{
                    flexDirection: 'column',
                    marginTop: 70,
                    alignItems: 'center',
                    justifyContent: 'center',
                    flex: 1
                }}>

                    {
                        this.state.isshow ? <View style={{
                                flexDirection: 'column',
                                alignItems: 'center',
                                justifyContent: 'center',
                            }}>
                                <Image style={{width: 60, height: 60}} source={require('./images/nodata.png')}/>
                                <Text style={{
                                    marginTop: 10,
                                    color: '#666666', fontSize: 16
                                }}>
                                    暂无自动化
                                </Text>

                            </View> :
                            null
                    }
                </View>
            </PageView>
        );

    }

    componentDidMount() {
        this.setState({
            refreshing: true,
        })
        setTimeout(() => {
            this.setState({
                refreshing: false,
            })
        }, 3000)
    }


}
let screenW = Dimensions.get('window').width;
let screenH = Dimensions.get('window').height;
// iPhoneX
const X_WIDTH = 375
const X_HEIGHT = 812
const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginBottom: Platform.OS === 'ios' &&
        ((screenH === X_HEIGHT && screenW === X_WIDTH) ||
            (screenH === X_WIDTH && screenW === X_HEIGHT)) ? 34 : null
    },
    title: {
        flexDirection: 'row',
        width: CommonStyle.screenwidth
    },
    title_left: {
        marginLeft: 15,
        alignSelf: 'center'
    },

});
